import React, {Component} from 'react';
import {connect} from "react-redux";

class CartFooter extends Component {
    constructor(props) {
        super(props);
    }

    render() {
        return (
            <div>
                <h2>CartFooter组件-兄弟关系</h2>
                <p>商品共 {this.props.totalNumber} 件</p>
                <p>商品总价¥： {this.props.totalPrice}</p>
            </div>
        );
    }
}

/*fn是一个高阶组件，HOC 如果一个函数的返回值还是一个组件，则称之为高阶组件*/
/*
* TODO： https://zh-hans.reactjs.org/docs/higher-order-components.html
* */
export default connect((state) => {
    var totalNumber = 0;
    var totalPrice = state.cartData.reduce((prev, next) => {
        totalNumber += next.number;
        return prev + next.goodsPrice * next.number;
    }, 0);

    return {
        totalPrice,
        totalNumber
    }
})(CartFooter);
